<?php
require_once ($_SERVER["DOCUMENT_ROOT"] ."/include/config.php");
require_once ("include/dict.php");

$dict = new DictionaryController($config);
$types = $dict -> GetDictionary("support_type", false);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>
		<script src="js/json.js" type='text/javascript'></script>
		<script src="js/jquery-ui.min.js" type="text/javascript"></script>
		<script src="js/util_script.js" type="text/javascript"></script>
		<script src="js/jquery.editable.js" type="text/javascript"></script>
		<script src="js/raphael-min.js" type="text/javascript"></script>
		<script src="js/connection.js" type='text/javascript'></script>
		<script src="js/jquery.dataTables.min.js" type="text/javascript"></script>
		<link href="css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
		<link href="css/styles.css" rel="stylesheet" type="text/css" />
		<link href="css/jquery-ui.css" rel="stylesheet" type="text/css" />
		<script type="text/javascript">var pointId =<?= getParam("id") ?>
			;
			var pointLocation = <?= getParam("location") ?>;
			var pointLayer = <?= getParam("layer") ?>;
			$(document).ready(function() {
				$("button").button();
				
				
				$("#add_connection").click(function() {
					parent.$("body").trigger({
					 type: "connection",
					 id: pointId,
					 cid: null, 
					 create: true,
                     canSaveConnection : true
					 });
				});
				$("#connection_points").on("click", ".connect-edit-link", function() {
					var id = $(this).closest("tr").attr("id");
					parent.$("body").trigger({
						type:"connection",
						id:pointId,
						cid:id,
                        canSaveConnection:true
					});

					return false;
				});
				$("#connection_designer").click(function() {
					parent.$("body").trigger({
						type : "connection",
						id : pointId,
                        canSaveConnection: false
					});
				});

				$("#point-title").editable();
				$("#point-comment").editable();

				$("#save-point").click(savePoint);
				$("#delete-point").click(deletePoint);
				bindPoint(pointId);
				initConnectionTable();
				
				$("body").bind("connection", function(e) {
					openConnection(e.id, e.cid ? e.cid : null, e.create ? true : false, e.canSaveConnection ? true : false);
				});

				$("body").bind("connectionSaved", function(e) {
					if (e.close)
						$("#connection_container").dialog("close");
					$('#point_container iframe').attr('src', function(i, val) {
						return val;
					});
				});
			});
		</script>
	</head>
	<body style="font-family: Verdana, sans-serif; font-size: 80%; ">
		<div width="100%" height="100%">
			<table width="100%" cellspacing="10" style='table-layout: fixed'>
				<tr>
					<td width="30%"><b>Название:</b></td>
					<td><span id="point-title" class="editable_single"></span></td>
				</tr>
				<tr>
					<td><b>Местоположение:</b></td>
					<td><span id="point-location"></span></td>
				</tr>
				<tr>
					<td><b>Тип опоры:</b></td>
					<td>
					<select id="point-support-type">
						<option value='0'> - </option>
						<?
						foreach ($types as $key => $value)
							echo "<option value='$key'>$value</option>";
						?>
					</select></td>
				</tr>
				<tr>
					<td>
						<b>Расположение:</b>
					</td>
					<td>
						<input type='checkbox' id='planCheck' />План
						<input type='checkbox' id='factCheck' />Факт
					</td>
				</tr>
				<tr>
					<td colspan="2"><b>Комментарий: </b>
					<br/>
					<span style="width:100%; display:inline-block;" id="point-comment"></span></td>
				</tr>
				<tr>
					<td colspan='2'><b>Точки соединения:</b>
					<br/>
					<span id="not_created"><i>Недоступно (подтвердите создание точки опоры)</i></span>
					<div id="connection_div" style="display:none; text-align: right">
						<table id="connection_points" width="100%">
							<thead>
								<tr>
									<th width="40%">Название</th>
									<th width="40%">Тип</th>
									<th></th>
								</tr>
							</thead>
						</table>
						<a href="javascript:void(0)" id="add_connection"> Добавить</a>
					</div></td>
				</tr>
				<tr id="connection-tr">
					<td colspan="2" align='middle' style='padding-top:10px'>
					<button id="connection_designer">
						Общая схема соединения
					</button>
				</tr>
				<tr>
					<td colspan='2'>
					<br/>
					<br/>
					<hr/>
					<br/>
					</td>
				</tr>
				<tr>
					<td align="left">
					<button id="delete-point">
						Удалить
					</button></td>
					<td align="right">
					<button id="save-point">
						Сохранить
					</button></td>
				</tr>
			</table>
		</div>
	</body>
</html>